<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <ui:composition template="/plantillas/plantillaPrincipal.xhtml">
        <ui:define name="contenido">
            <f:view>
                <h:form id="formNuevoProveedor">
                    <h:panelGrid columns="1" style="width: 650px;margin: 5px auto;">
                        <p:commandButton action="#{MBProveedor.nuevo()}" value="AGREGAR PROVEEDOR" ajax="false" />
                    </h:panelGrid>
                </h:form>
                <h:form id="formBuquedaProveedor">
                    <p:panel id="pnlConsultaProveedor" header="Consulta Proveedores" style="width: 650px;margin: 0px auto;" 
                             toggleable="true" widgetVar="buscar" collapsed="#{BKProveedor.listaTodosProveedoresActivos ne null}" >
                        
                        <p:panelGrid style="width:100%">
                            <p:row>
                                <p:column style="width:200px">
                                    <h:outputText id="lblBusquedaRuc" value="RUC / DNI : " class="lblBusqueda" />
                                </p:column>
                                <p:column colspan="3">
                                    <p:inputText id="idRucProveedor" value="#{BKProveedor.proveedorBusqueda.ruc}" style="width:100%" />
                                </p:column>
                                
                            </p:row>
                            <p:row>
                                <p:column>
                                    <h:outputText id="lblBusquedaRazonSocial" value="RAZON SOCIAL / NOMBRE : " class="lblBusqueda" />
                                </p:column>
                                <p:column colspan="3">
                                    <p:inputText onkeyup="cambiarMayuscula(this)" id="txtBusquedaRazonSocial" value="#{BKProveedor.proveedorBusqueda.razonSocial}" style="width:100%"/>
                                </p:column>
                            </p:row>
                            <p:row>
                                <p:column>
                                    <h:outputText id="lblBusquedaNomComercial" value="NOMBRE COMERCIAL: " class="lblBusqueda" />
                                </p:column>
                                <p:column colspan="3">
                                    <p:inputText onkeyup="cambiarMayuscula(this)" id="txtBusquedaNomComercial" value="#{BKProveedor.proveedorBusqueda.nombreComercial}" style="width:100%"/>
                                </p:column>
                            </p:row>

                            
                            <p:row>
                                <p:column>
                                    <p:commandButton id="btnBuscarProveedor" value="BUSCAR" oncomplete="listaProveedor.show();buscar.toggle()" 
                                             update="pnlConsultaProveedor,dataTablaProveedor" style="font-size:12px"
                                             actionListener="#{MBProveedor.buscarListaProveedor}" styleClass="ui-priority-primary"/>
                                </p:column>
                            </p:row>

                        </p:panelGrid>
                        
                        <h:panelGrid columns="2" styleClass="grid" columnClasses="label, value" rendered="false">

                            <h:outputText id="lblArticulol" value="INSUMO : " class="lblBusqueda" style="font-weight:bold"/>
                            <p:selectOneMenu value="#{BKProveedor.articuloBusqueda}" id="idArticulo" panelStyleClass="print"
                                             converter="#{articuloConverter}" var="arti" filter="true" filterMatchMode="contains" 
                                             panelStyle="width:400px" style="width: 400px"  >  
                                <f:selectItem itemLabel="Seleccionar" itemValue="" />  
                                <f:selectItems value="#{BKProveedor.listaArticulosBusqueda}" var="art"
                                               itemLabel="#{art.nombreComercial}" itemValue="#{art}"  />
                                <p:ajax event="change" process="@this" />
                                <p:column filterStyleClass="print">  
                                    #{arti.nombreComercial}
                                </p:column> 
                            </p:selectOneMenu>

                            <h:outputText id="lblBusquedaServicio" value="SERVICIO : " class="lblBusqueda" style="font-weight:bold"/>
                            <p:selectOneMenu value="#{BKProveedor.servicioBusqueda}" converter="#{servicioConverter}"   
                                             effect="fade" id="idServicio" var="ser" filter="true" filterMatchMode="contains">  
                                <f:selectItem itemLabel="Seleccionar" itemValue="" />  
                                <f:selectItems value="#{BKProveedor.listaServiciosBusqueda}" var="serv" 
                                               itemLabel="#{serv.nombre}" itemValue="#{serv}"/> 
                                <p:ajax event="change" process="@this" />
                                <p:column>  
                                    #{ser.nombre}
                                </p:column>  
                            </p:selectOneMenu>

                            
                        </h:panelGrid>
                    </p:panel>

                    <p:panel id="pnlListaProveedores" header="Lista Proveedores" closable="true" 
                             style="width: 80%;margin: 10px auto" 
                             visible="#{(BKProveedor.listaTodosProveedoresActivos eq null)?false:true}" widgetVar="listaProveedor" >

                        <p:dataTable id="dataTablaProveedor" var="proveedor" value="#{BKProveedor.listaTodosProveedoresActivos}" 
                                     emptyMessage="No se encontraron proveedores" paginator="true" rows="20" rowIndexVar="rowIndex"
                                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} 
                                     {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  style="width:100%"
                                     rowsPerPageTemplate="20,40,60" sortOrder="ascending" sortBy="#{proveedor.ruc}" 
                                     scrollable="true" paginatorPosition="bottom" styleClass="datable-busqueda" scrollHeight="250"> 

                            <f:facet name="header" >
                                <p:outputPanel layout="block" >
                                    <h:commandButton value="Exportar EXCEL">  
                                        <p:dataExporter type="xls" target="dataTablaProveedor" fileName="proveedores" />  
                                    </h:commandButton>  

                                    <h:commandButton value="Exportar PDF">  
                                        <p:dataExporter type="pdf" target="dataTablaProveedor" fileName="proveedores"/>  
                                    </h:commandButton>
                                </p:outputPanel>

                            </f:facet>

                            <p:column id="idColumnaNum" headerText="Num." style="width: 5%"> 
                                <h:outputText value="#{rowIndex+1}" /> 
                            </p:column>

                            <p:column id="idColumnaRuc" sortBy="#{proveedor.ruc}" style="width: 15%"> 
                                <f:facet name="header">  
                                    <h:outputText value="RUC / DNI" />  
                                </f:facet>
                                <h:outputText value="#{proveedor.ruc}" /> 
                            </p:column>

                            <p:column id="idColumnaNombreComercial" sortBy="#{proveedor.nombreComercial}" style="width: 30%">  
                                <f:facet name="header">  
                                    <h:outputText value="NOMBRE COMERCIAL" />  
                                </f:facet>
                                <h:outputText value="#{proveedor.nombreComercial}" /> 
                            </p:column>

                            <p:column id="idColumnaRazonSocial" sortBy="#{proveedor.razonSocial}" style="width:35%"> 
                                <f:facet name="header">  
                                    <h:outputText value="RAZON SOCIAL / NOMBRE" />  
                                </f:facet>
                                <h:outputText value="#{proveedor.razonSocial}" /> 
                            </p:column>

                            <p:column id="idAccionesProveedor" exportable="false" style="width: 15%">
                                <p:commandButton icon="ui-icon-search" title="Ver" action="#{MBProveedor.ver()}" immediate="true" ajax="false">
                                    <f:setPropertyActionListener value="#{proveedor}" target="#{BKProveedor.proveedorFormulario}" />  
                                </p:commandButton>
                                <p:commandButton icon="ui-icon-pencil" title="Editar" action="#{MBProveedor.editar()}" immediate="true" ajax="false">
                                    <f:setPropertyActionListener value="#{proveedor}" target="#{BKProveedor.proveedorFormulario}" />  
                                </p:commandButton>  
                                <p:commandButton id="btnEliminarProveedor" title="Eliminar" icon="ui-icon-trash"  oncomplete="confirmacion.show()">
                                    <f:setPropertyActionListener value="#{proveedor}" target="#{BKProveedor.proveedorSeleccionado}" />
                                </p:commandButton>
                            </p:column>

                        </p:dataTable>
                    </p:panel> 
                    <p:confirmDialog id="dlgEliminarProveedor" message="¿ Realmente desea eliminar este proveedor ?" 
                                     header="Eliminar Proveedor" severity="alert" widgetVar="confirmacion">
                        <h:panelGrid style="width: auto;margin:0px auto;border:0px;padding: 0 5px" columns="2">
                            <p:commandButton id="btnConfEliProveedor" update="dataTablaProveedor" value="#{message['general.button.si']}"  oncomplete="confirmacion.hide()"  
                                             actionListener="#{MBProveedor.eliminar}" style="text-align: center" />  
                            <p:commandButton id="btnCancEliProveedor" value="#{message['general.button.no']}" onclick="confirmacion.hide()" type="button" style="text-align: center" />   
                        </h:panelGrid>
                    </p:confirmDialog>

                </h:form>
            </f:view>
        </ui:define>
    </ui:composition>
</html>